<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jQuery+CSS3个人资料分步填写表单</title>
<link type="text/css" rel="stylesheet" href="/css/reg.css" media="screen">
</head>
<body>
<section class="container">
<form id="form">
	<fieldset class="alpha">
		<legend><b>1. </b>个人信息</legend>
		<div class="frow">
			<input class="item" name="username" placeholder="用户名" type="text" value="">
		</div>
		<div class="frow">
			<input class="item" name="alias" placeholder="昵称" type="text">
		</div>
		<div class="frow">
			<input class="item" name="password" placeholder="密码" type="password">
		</div>
		<div class="frow">
			<a class="next-step" href="#">下一步</a>
		</div>
	</fieldset>
	<fieldset class="beta">
		<legend><b>2. </b>社交信息</legend>
		<div class="frow">
			<label for="man">男</label>
			<input id="man" type="radio" name="sex" value="0"/>
			<label for="women">女</label>
			<input id="women" type="radio" name="sex" value="1"/>
			
		</div>
		<!-- <div class="frow">
			<input class="item" placeholder="新浪微博" required type="url">
		</div>
		<div class="frow">
			<input class="item" placeholder="腾讯微博" required type="url">
		</div> -->
		<div class="frow">
			<a class="prev-step" href="#">上一步</a>
		</div>
		<div class="frow">
			<input class="submit" type="submit" onclick="regSubmit()" value="完成">
		</div>
	</fieldset>
	<fieldset class="charlie">
		<legend><b>3. </b>完成</legend>
		<div class="frow">
			<p id="reg_msg"></p><a href="/user/index">返回桌面</a>
		</div>
	</fieldset>
</form>
</section>
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="/js/reg.js"></script>
<script type="text/javascript">

	function regSubmit() {
		$.ajax({
			type : "POST",
			async : false,
			url : "/user/register",
			data : $("#form").serialize(),
			success : function (msg) {
				if(msg.code == "success"){
					$("#reg_msg").text("您的信息已经填写完整，谢谢!!")
				}else {
					$("#reg_msg").text("发生了不明错误!")
				}
				
			}
		});
	}
	

</script>
</body>
</html>